<template>
	<view>
		<view class="account_top">
			<view class="con">
				<div class="mass">
					<div class="con">
						<p>商户名称：{{name}}</p>
						<p>商户号：{{no}}</p>
					</div>
				</div>
				<view class="top">
					<view class="left">
						<view class="p">商户自存收益：
						</view>
						<view class="b">{{info.total}}</view>
					</view>
					<view class="left">
						
					</view>
				</view>
			</view>
		</view>

		<view class="wp">
			<view class="shu_title">
				<view class="span" style="background-color: #e8a566;"></view>
				<text>收益明细</text>
			</view>
			<view class="table">
				<view class="item">
					<view class="td one th">自存金额</view>
					<view class="td two th">商户自存收益</view>
					<view class="td three th">到期时间</view>
				</view>
				<view class="item"  v-for="(item,i) in info.items" :key="i">
					<view class="td one">10000</view>
					<view class="td two">500</view>
					<view class="td three">2024-05-12</view>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info: [],
				list:[],
				name: '',
				no: '',
				isend: false,
			}
		},
		onLoad(e) {
			let that = this;
			that.name = e.name;
			that.no = e.id;
			that.GetList();
		},
		methods: {

			GetList: function() {
				let that = this;
				uni.showLoading({
					title: '加载中...',
					mask: true
				});
				let _data = {
					page:1,
					per_page:50
				};
				that.common.http('GET', 'user/earnings', '', function(res) {
					uni.hideLoading();
					console.log(res.data)
					that.info = res.data;
					that.isend = true;
				});
			},
		}
	}
</script>

<style scoped>
	.wp {
		margin-top: 30rpx;
	}

	.mass {
		padding: 0 18rpx;
	}

	.mass .con {
		border-bottom: 1px solid #fff;
		padding: 20rpx 0;
	}

	.mass .con p {
		font-size: 28rpx;
		color: #fff;
		margin: 10rpx 0;
	}

	.account_top {
		background-color: #f7f7f7;
		padding: 0 18rpx;
	}

	.account_top>.con {
		background-image: url('@/static/images/pic6.jpg');
		background-repeat: no-repeat;
		background-position: center;
		border-top-left-radius: 12px;
		border-top-right-radius: 12px;
		background-size: 100% 100%;
	}

	.account_top .con .top {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 30rpx 22rpx;
	}

	.account_top .con .top .left {}

	.account_top .con .top .left image {
		width: 40rpx;
		vertical-align: middle;
	}

	.account_top .con .top .p {
		font-size: 24rpx;
		display: inline-block;
		color: #fff;
		vertical-align: 3px;
	}

	.account_top .con .top .b {
		font-size: 40rpx;
		display: inline-block;
		color: #fff;
		font-weight: bold;
		margin-top: 16rpx;
	}

	.table .item {
		display: flex;
		justify-content: space-between;
		border-bottom: 1px solid #ebebeb;
	}

	.table .item .td {
		text-align: left;
		font-size: 28rpx;
		color: #333;
		padding: 26rpx 0;
	}

	.table .item .td.th {
		color: #999;
		font-size: 24rpx;
	}

	.table .item .td.one {
		width: 40%;
	}
	
	.table .item .td.two {
		width: 30%;
	}
	
	.table .item .td.three {
		width: 40%;text-align: center;
	}
	.table .item .td.more {
		background-image: url('@/static/images/app_i3.png');
		background-repeat: no-repeat;
		background-position: right 18rpx center;
		background-size: 24rpx auto;
	}

	/* .table .item .td:last-child{width: 40%;text-align: left;font-size: 28rpx;} */
</style>